<script setup>
import {computed, reactive, ref, toRefs} from "vue";
import WanFengSelect from "@/components/wanfengComponents/WanFengSelect.vue";
import {LimsConfig} from "@/api/lims/common/LimsModel";
import {getTableRecord} from "@/api/lims/sysManager/table";

const props = defineProps({
  form: Object
})
const {form} = toRefs(props)
const rules = ref({})
const charges = ref([])
const settingPayment = (data) => {
  charges.value = data
}
const invoiceType = computed(()=>{
  return form.value.PAYMENT_INVOICE_TYPE ? form.value.PAYMENT_INVOICE_TYPE.split(',') : []
})
const handleInvoiceTypeChange = (val) =>{
  form.value.PAYMENT_INVOICE_TYPE = val.join(',')
}

const onPaymentUnitChange = (value) =>{
  console.log('----------value is :::',value)
  if (value){
    let config = new LimsConfig('M_CONTRACT_ANALYSIS')
    config.filters.eq('PAYMENT_UNIT_NAME', value)
    getTableRecord(config).then(response => {
      console.log('response is :::', response)
      if (response.success && response.data && response.data.length > 0){
        let payInfo = response.data[0]
        form.value.PAYMENT_TAXES_NUMBER = payInfo.PAYMENT_TAXES_NUMBER
        form.value.PAYMENT_BANK_NAME = payInfo.PAYMENT_BANK_NAME
        form.value.PAYMENT_BANK_NO = payInfo.PAYMENT_BANK_NO
        form.value.PAYMENT_UNIT_PHONE = payInfo.PAYMENT_UNIT_PHONE
      }
    })
  }
}

const formInfo = ref()
defineExpose({
  formInfo, settingPayment
})
</script>

<template>
  <el-form label-width="120px" ref="formInfo" :model="form" :rules="rules">
    <el-form-item label="缴费方式" prop="PAYMENT_METHOD">
      <el-radio-group v-model="form.PAYMENT_METHOD">
        <el-radio label="转账汇款">转账汇款</el-radio>
        <el-radio label="现场缴费"></el-radio>
      </el-radio-group>
      <el-select v-model="form.PAYMENT_METHOD">
        <el-option label="现金" value="现金"></el-option>
        <el-option label="转账" value="转账"></el-option>
        <el-option label="扫码" value="扫码"></el-option>
      </el-select>
    </el-form-item>
    <el-row :gutter="20">
      <el-col :span="8">
        <el-form-item label="检验费用" prop="PAYMENT_INSPECT_FEES">
          <el-input v-model="form.PAYMENT_INSPECT_FEES" disabled>
            <template #append>元</template>
          </el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="折扣" prop="PAYMENT_DISCOUNT">
          <el-input v-model="form.PAYMENT_DISCOUNT" disabled>
            <template #append>%</template>
          </el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8" style="text-align: left">
        <el-form-item label="应收费用" prop="PAYMENT_INSPECT_FEES_DISCOUNT">
          <el-input v-model="form.PAYMENT_INSPECT_FEES_DISCOUNT" disabled>
            <template #append>元</template>
          </el-input>
        </el-form-item>
      </el-col>

    </el-row>
    <el-row>
      <el-col :span="24">
        <el-form-item label="费用清单">
          <el-tag v-for="charge in charges"
                  effect="dark"
                  round
                  :key="charge.index">
            {{ charge.chargeName }} : {{ charge.chargeFee }}
          </el-tag>
        </el-form-item>
      </el-col>
    </el-row>
    <el-divider>开票状态</el-divider>
    <el-row :gutter="20">
      <el-col :span="8">
        <el-form-item label="转账状态">
          <el-radio-group v-model="form.PAY_STATUS">
            <el-radio label="未付款"></el-radio>
            <el-radio label="已付款"></el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="开票状态">
          <el-radio-group v-model="form.INVOICE_STATUS">
            <el-radio label="未开票"></el-radio>
            <el-radio label="已开票"></el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="发票领取状态">
          <el-radio-group v-model="form.INVOICE_RECEIVE_STATUS">
            <el-radio label="未领取"></el-radio>
            <el-radio label="已领取"></el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
    </el-row>
    <el-divider>发票信息</el-divider>


    <el-form-item label="发票类型" prop="PAYMENT_INVOICE_TYPE">
      <el-checkbox-group v-model="invoiceType" @change="handleInvoiceTypeChange">
        <el-checkbox label="电子普通发票">电子普通发票</el-checkbox>
        <el-checkbox label="电子专用发票">电子专用发票</el-checkbox>
        <el-checkbox label="增值税普通发票">增值税普通发票</el-checkbox>
        <el-checkbox label="增值税专用发票">增值税专用发票</el-checkbox>
      </el-checkbox-group>

    </el-form-item>

    <el-form-item label="单位名称" prop="PAYMENT_UNIT_NAME">
      <wan-feng-select  v-model="form.PAYMENT_UNIT_NAME" value="PAYMENT_UNIT_NAME" label="PAYMENT_UNIT_NAME"
                        table-name="M_CONTRACT_ANALYSIS"
                        where="PAYMENT_UNIT_NAME IS NOT NULL"
                        allow-create
                        @change="onPaymentUnitChange"
      ></wan-feng-select>
<!--      <el-input v-model="form.PAYMENT_UNIT_NAME"></el-input>-->
    </el-form-item>
    <el-form-item label="纳税人识别号" prop="PAYMENT_TAXES_NUMBER">
      <el-input v-model="form.PAYMENT_TAXES_NUMBER"></el-input>
    </el-form-item>

    <el-form-item label="开户行" prop="PAYMENT_BANK_NAME">
      <el-input v-model="form.PAYMENT_BANK_NAME"></el-input>
    </el-form-item>
    <el-form-item label="开户行账号" prop="PAYMENT_BANK_NO">
      <el-input v-model="form.PAYMENT_BANK_NO"></el-input>
    </el-form-item>
    <el-form-item label="单位地址及电话" prop="PAYMENT_UNIT_PHONE">
      <el-input v-model="form.PAYMENT_UNIT_PHONE"></el-input>
    </el-form-item>
  </el-form>

</template>

<style scoped lang="scss">

</style>